<template>
  <view class="collection-info">
    <template v-if="index == '0'">
      <view class="card">
        <view class="form-item">
          <view>收运单位：</view>
          <view>{{}}</view>
        </view>
        <view class="form-item">
          <view>收运公司：</view>
          <view>{{}}</view>
        </view>
        <view class="form-item">
          <view>收运司机/收运工：</view>
          <view>{{}} </view>
        </view>
        <view class="form-item">
          <view>车牌号：</view>
          <view>{{}} </view>
        </view>
      </view>
      <view class="card">
        <view class="title"> 行驶路线 </view>
        <view style="margin-bottom: 20rpx">11111111</view>
        <view>运输时间：2h</view>
      </view>
      <view class="card">
        <view class="title"> 报警信息 </view>
        <view>偏离路线</view>
      </view>
      <view class="card">
        <view class="title"> 消错记录 </view>
        <view
          >内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述内容描述</view
        >
        <view class="image">1111</view>
        <view class="state">状态: 已处理</view>
      </view>
    </template>
    <template v-if="index == '1'">
      <view class="card">
        <view class="title"> 称重桶数 : {{}} </view>
        <view
          v-for="(item, i) of [1, 2, 3, 4]"
          :key="item"
          class="l-border-top"
          :style="{
            paddingBottom: i != [2, 3, 4, 5].length - 1 ? '30rpx' : '',
          }"
        >
          <view class="form-item">
            <view>油品名称：</view>
            <view>{{}}</view>
          </view>
          <view class="form-item">
            <view>油品种类：</view>
            <view>{{}}</view>
          </view>
          <view class="form-item">
            <view>称重：</view>
            <view>{{}} </view>
          </view>
        </view>
      </view>
    </template>
    <template v-if="index == 2">
      <view class="card">
        <view class="title"> 附件信息 </view>
        <view style="margin-bottom: 20rpx">
          <u-album :urls="urls1" keyName="src2"></u-album>
        </view>
      </view>
    </template>
    <template v-if="index == 3">
      <view class="card">
        <view class="title"> 现场照片 </view>
        <view style="margin-bottom: 20rpx">
          <u-album :urls="urls1" keyName="src2"></u-album>
        </view>
      </view>
    </template>
  </view>
</template>
<script>
export default {
  props: {
    index: {
      type: [String, Number],
      default: "2",
    },
  },
  components: {},
  data() {
    return {
      urls1: [
        {
          src2: "https://cdn.uviewui.com/uview/album/1.jpg",
        },
      ],
      pageData: {},
      list1: [
        {
          name: "收运信息",
        },
        {
          name: "称重信息",
        },
        {
          name: "单据信息",
        },
        {
          name: "签到信息",
        },
      ],
    };
  },
  onLoad(option) {},
  methods: {
    getData() {},
  },
};
</script>
<style lang="scss" scoped>
.collection-info {
  .form-item {
    display: flex;
    font-size: 30rpx;
    padding-top: 20rpx;
    view:nth-child(2) {
      color: #000;
    }
  }
  .state {
    font-size: 30rpx;
    color: #666668;
    background: rgba(20, 144, 88, 0.1);
    padding: 12rpx 0 12rpx 20rpx;
  }
  .title {
    padding: 30rpx 0 20rpx 0;
    font-size: 30rpx;
    color: #000000;
  }
  .image {
    margin: 20rpx 0;
  }
  .card {
    padding: 0 30rpx 30rpx 30rpx;
    margin-bottom: 30rpx;
    background: #fff;
    border-radius: 12rpx;
  }
}
</style>
